:root{
    --ch:600px;
    --cw:600px;
    --bh:200px;
    --bw:200px;
}
.container{
    width: var(--cw);
    height:var(--ch);
    outline: 1px solid red;
    /* margin: 100px auto; */
    /* margin: 40% auto 0 ; */
    position: relative;
    /* text-align: center;
    line-height: calc(var(--ch) + var(--bh)) */
    border: 1px solid black;
    display: flex;
    justify-content: center;
    align-items: center;
    
}
.box{
    width: var(--bw);
    height: var(--bh);
    background-color: rgb(88, 185, 93);
    /* position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%); */

    /* margin: 0 auto ;
    position: relative;
    top: calc((var(--ch) - var(--bh)) / 2); */

    /* display: inline-block; */
    /* margin-top: 50%; */
    
}